<template>
  <div class="signs">
    <si-gn ref="sign"></si-gn>

    <el-button type="primary" @click="sign" :disabled="isSigns">签到</el-button>
  </div>
</template>
<script>
import SiGn from "@/components/SiGn/index.vue";
import { signInList, appendSignInList } from "@/components/SiGn/index.js";
export default {
  components: {
    SiGn,
  },
  data() {
    return {
      isSigns: false,
    };
  },
  mounted() {
    let isSign = this.getIsSign();
    if (isSign) {
      this.isSigns = true;
    }
  },
  methods: {
    sign() {
      // 获取日期列表
      let datas = this.$refs.sign.datas;
      let isSign = this.getIsSign();
      if (isSign) {
        console.log("已签到");
        return;
      } else {
        this.$nextTick(() => {
          let currentDate = this.getDay();
          appendSignInList(currentDate);
          this.$refs.sign.signIn(datas[currentDate - 1]);
          this.isSigns = true;
        });
      }
    },
    // 判断当前日期是否在已签到数据内
    getIsSign() {
      let currentDate = this.getDay();
      return signInList.includes(currentDate);
    },
    // 获取当前日期
    getDay() {
      return new Date().getDate();
    },
  },
};
</script>

<style lang="scss" scoped>
// 这里可以编写 SCSS 样式
</style>
